<template>
  <view>
    <view class="sticky top0 z-99 bg-fff pb-30">
      <u-navbar :background="{ backgroundColor:'#9CE0FF'}" :border-bottom="false" title-color="#000" title-size="37" :custom-back="switchHome"/>
      <view class="pt-30 pl-40">
        <view class="color-000000 fz-56">切换医院登录</view>
        <view class="color-CCCCCC fz-28">轻触医院以登录</view>
      </view>
    </view>
    <view>
      <view class="min-h-100 w-full flex justify-center align-center oh"
            v-for="item in hospitalListWithAll"
            :key="item.hospitalId"
            @tap="handleReplace(item.hospitalId)">
        <view class="min-h-100 w-710 border-bottom-CCCCCC border-box flex space-between align-center oh">
          <view class="flex oh align-center">
            <image class="ml-20 mr-20 w-64 min-w-64 h-64" src="@/static/images/mine/hospital.png"/>
            <view class="fz-30 color-333333 mr-20 break-all">{{item.name}}</view>
            <view v-if="item.hospitalId === curHospitalId"
                  class="current-login-label p-lr-10 h-36 lh-36 br-20 fz-18 text-center nowrap">当前登录</view>
          </view>
        </view>
      </view>
    </view>

  </view>
</template>

<script>
import {getHospitals} from '@/api/common'
import {mapGetters} from 'vuex'

export default {
  name: 'replace-hospital',
  data() {
    return {
      hospitalList: []
    }
  },
  computed: {
    ...mapGetters(['curHospitalId']),
    hospitalListWithAll() {
      if (this.$auth.hasRoleOr(['admin','co-admin'])) {
        return [{hospitalId: '', name: '全部'}].concat(this.hospitalList)
      } else {
        return this.hospitalList
      }
    }
  },
  onLoad() {
    this.initHospitalList()
  },
  methods: {
    initHospitalList() {
      return getHospitals().then(res => {
        this.hospitalList = res.data
        return Promise.resolve(res)
      })
    },
    handleReplace(hospitalId) {
      if (typeof hospitalId !== 'string' || hospitalId === this.curHospitalId) return
      this.$store.dispatch('ReplaceCurHospitalId', hospitalId).then(() => {
        uni.showToast({title: '切换成功'})
      })
    },
    switchHome(){
      uni.switchTab({
        url: "/pages/tabbar/home/home",
      });
    }
  }
}
</script>

<style>
page{
  background-color: #FFFFFF;
}
</style>

<style scoped lang="scss">
.current-login-label {
  background-color: #ECF5FF;
  border: 1rpx solid #409EFF;
  color: #2D8CF0;
}
</style>
